<!doctype html>
<html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <title>Picdiet - 极速的在线图片压缩80%图片体积</title>
  <meta name="keywords" content="图片压缩，jpg压缩, 在线图片压缩，减少图片体积，HTML5, 免费">
  <meta name="description" content="Picdiet是一款用JavaScript编写而成的图片压缩神器，所有压缩过程都在浏览器中进行，完全免费">
  <link rel="shortcut icon" href="favicon.ico">
  <link rel="stylesheet" href="global.css">
</head>

<body>
  <header>
    <a id="logo">
      <svg xmlns="http://www.w3.org/2000/svg" width="200" viewBox="0 0 123.98438 38.125">
        <g style="line-height:125%" font-size="40" font-family="sans-serif" letter-spacing="0" word-spacing="0">
          <path
            d="M5.37 38.125H0V9.238h1.29l2.128 2.52q.723-.684 1.582-1.29.86-.605 1.777-1.034.938-.45 1.934-.704.997-.253 2.013-.253 2.207 0 4.14.8 1.953.782 3.4 2.227Q19.726 12.95 20.565 15q.84 2.03.84 4.512 0 2.578-.84 4.648-.84 2.05-2.304 3.496-1.446 1.426-3.4 2.188-1.932.76-4.14.76-.702 0-1.406-.155-.683-.157-1.367-.41-.665-.274-1.33-.606-.643-.332-1.25-.684v9.375zm10.685-18.613q0-1.328-.43-2.383-.41-1.056-1.133-1.778-.722-.743-1.7-1.133-.976-.392-2.07-.392-1.093 0-2.07.39-.957.39-1.68 1.134-.722.722-1.152 1.777-.41 1.054-.41 2.382 0 1.27.41 2.324.43 1.055 1.153 1.797.722.742 1.68 1.152.976.41 2.07.41 1.093 0 2.07-.41.977-.41 1.7-1.152.722-.742 1.132-1.797.43-1.055.43-2.324zM30.664 3.555q0 .742-.293 1.386-.272.646-.76 1.134-.49.47-1.153.762-.644.273-1.387.273-.742 0-1.406-.274-.644-.293-1.133-.762-.467-.488-.76-1.133-.274-.643-.274-1.385 0-.723.274-1.368.293-.664.76-1.132.49-.49 1.134-.762Q26.328 0 27.07 0q.743 0 1.387.293.664.273 1.152.762.488.468.76 1.132.294.645.294 1.368zm-.918 26.6h-5.37V9.24h5.37v20.918zM52.11 13.398l-3.907 3.926q-.293-.82-.8-1.465-.508-.665-1.153-1.114-.625-.45-1.367-.684-.742-.234-1.524-.234-1.094 0-2.07.45-.958.45-1.68 1.27-.704.8-1.114 1.913-.41 1.114-.41 2.462 0 1.094.41 2.05.41.958 1.113 1.68.722.723 1.68 1.133.976.41 2.07.41.78 0 1.503-.215.723-.214 1.348-.605.645-.41 1.134-.977.508-.586.82-1.29l3.906 3.927q-.742 1.055-1.718 1.895-.957.84-2.09 1.425-1.114.586-2.364.88-1.23.312-2.54.312-2.206 0-4.16-.82-1.932-.84-3.397-2.286-1.445-1.444-2.284-3.378-.84-1.933-.84-4.14 0-2.402.84-4.492t2.285-3.633q1.466-1.563 3.4-2.46 1.952-.9 4.16-.9 1.308 0 2.558.333 1.27.332 2.402.976 1.153.625 2.11 1.543.976.917 1.68 2.108z"
            fill="#2b95fd"></path>
          <path
            d="M74.902 30.156h-1.29l-2.07-2.87q-.76.683-1.62 1.288-.84.586-1.777 1.035-.938.43-1.934.683-.976.254-1.99.254-2.208 0-4.16-.82-1.935-.84-3.4-2.305-1.445-1.484-2.285-3.496-.84-2.03-.84-4.414 0-2.364.84-4.395.84-2.03 2.285-3.515 1.465-1.485 3.4-2.325 1.952-.84 4.16-.84.702 0 1.444.118.762.117 1.465.39.722.254 1.347.684.625.43 1.054 1.054V.918h5.372v29.238zm-5.37-10.644q0-1.094-.43-2.11-.41-1.035-1.133-1.816-.724-.8-1.7-1.27-.957-.488-2.05-.488-1.095 0-2.072.39-.957.39-1.68 1.134-.702.722-1.113 1.777-.41 1.054-.41 2.382 0 1.152.41 2.187.41 1.034 1.114 1.816.72.78 1.678 1.23.977.45 2.07.45 1.095 0 2.052-.47.976-.488 1.7-1.27.72-.8 1.132-1.815.43-1.035.43-2.128zM85.273 3.555q0 .742-.293 1.386-.273.646-.76 1.134-.49.47-1.154.762-.644.273-1.386.273-.742 0-1.407-.274-.644-.293-1.132-.762-.468-.488-.76-1.133-.275-.643-.275-1.385 0-.723.274-1.368.292-.664.76-1.132.49-.49 1.133-.762Q80.938 0 81.68 0t1.386.293q.664.273 1.153.762.487.468.76 1.132.293.645.293 1.368zm-.918 26.6h-5.37V9.24h5.37v20.918zM96.758 25.04q.312.097.625.136.312.02.625.02.78 0 1.504-.216.722-.214 1.347-.605.644-.41 1.132-.977.508-.586.82-1.29l3.907 3.927q-.743 1.055-1.72 1.895-.957.84-2.09 1.425-1.113.586-2.363.88-1.23.312-2.54.312-2.206 0-4.16-.82-1.933-.82-3.398-2.286-1.446-1.463-2.286-3.475-.84-2.03-.84-4.453 0-2.48.84-4.532.84-2.05 2.285-3.496 1.464-1.445 3.398-2.246 1.953-.8 4.16-.8 1.308 0 2.558.312 1.25.312 2.364.898 1.133.586 2.11 1.446.976.84 1.718 1.894l-10 12.05zm2.734-10.997q-.37-.137-.742-.176-.352-.04-.742-.04-1.094 0-2.07.41-.958.392-1.68 1.134-.703.743-1.113 1.798-.41 1.035-.41 2.344 0 .293.02.664.038.37.097.76.078.373.175.724.098.352.254.625l6.212-8.242zM119.94 30.156q-1.932 0-3.63-.722-1.7-.743-2.99-2.012-1.27-1.29-2.01-2.988-.724-1.7-.724-3.633v-6.21h-2.598V9.277h2.598V.917h5.312v8.36h8.086v5.313h-8.086v6.21q0 .84.313 1.583.313.722.86 1.27.547.546 1.29.878.742.314 1.58.314h4.044v5.312h-4.043z"
            fill="#ff93b7"></path>
        </g>
      </svg>
    </a>
    <h1>
      基于mozjpeg，能极速压缩80%的图片大小，而不损害其质量
    </h1>
    <p class="gp">
      Picdiet是一款在线批量压缩图片神器，它不需要后端服务器或者API的支持，仅通过你的浏览器来压缩图片大小，这意味着它压缩图片极快并且不会导致隐私或敏感图片泄漏。同时我们大量的测试结果也证明其压缩表现要远好于常规的压缩软件如：jpegoptim，jpegtran，jpegrescan和jpegmini
    </p>
  </header>
  <main>
    </div>
    <div id="upload" align="center">
      <ul class="upload_intro">
        <li>支持的图片格式:jpg，jpeg</li>
        <li class="rd">无图像尺寸限制</li>
        <li class="rd">无图像数量限制</li>
        <li>无文件大小限制</li>
      </ul>
      <div id="btn_outer">
        <div class="q_outer">
          <span class="q_title">输出图像质量:</span>
          <span id="quality">75%</span>
          <input type="range" max="99" min="1" value="75" id="q_value">
        </div>
        <span role="button" id="upload_btn">
          <span id="single_spinner">
            <span id="spinner"></span>
            <span id="pgs_percent"></span>
          </span>
          <span id="up_txt">选择你的图片</span>
          <input type="file" id="input" multiple accept=".jpg, .jpeg">
        </span>
      </div>
      <span id="dld">下载文件</span>
      <ul class="compress_info" id="compress_info">
        <li>压缩耗时:<span id="duration"></span></li>
        <li>原始文件大小: <span id="pre_filesize"></span> </li>
        <li>压缩后文件大小: <span id="aft_filesize"></span> </li>
        <li>压缩百分比:<span id="reduction_percent"></span></li>
      </ul>
    </div>
    <div id="compare">
      <div class="compare_wrapper">
        <div id="separator">
          <span class="left-arr"></span>
          <span class="right-arr"></span>
        </div>
        <div class="img_original" id="img_original">
          <span class="compare_title_right" id="o_title">原始: 1.7MB</span>
          <!--<img src="photographer.jpg" alt="woman taking a photo" id="before">-->
          <img src="https://cdn.jsdelivr.net/gh/peng4740/Picdiet/photographer.jpg" alt="woman taking a photo" id="before">
        </div>
        <div class="img_compressed" id="img_compressed">
          <span class="compare_title" id="p_title">Picmin: 250.35KB</span>
          <!--<img src="photographer_compressed.jpg" alt="woman taking a photo" id="after">-->
          <img src="https://cdn.jsdelivr.net/gh/peng4740/Picdiet/photographer_compressed.jpg" alt="woman taking a photo" id="after">
        </div>
      </div>
    </div>
    <div id="result">
      <div class="left">
        <div class="bar">
          <span class="bar_blue" id="bar_blue"></span>
          <span class="bar_txt">Picmin:
            <span id="bar_after">250.35KB</span>
            (<span id="bar_reduction">86%</span> 减小体积)
          </span>
        </div>
        <div class="bar">
          <span class="bar_pink"></span>
          <span class="bar_txt">原始:
            <span id="bar_pre">1.7MB</span>
          </span>
        </div>
      </div>
      <div class="dld_btn" id="dld_original">
        <a href="photographer.jpg" download="original_image">原始图像</a>
        <a href="photographer_compressed.jpg" download="compressed_image">压缩图像</a>
      </div>
    </div>
    <span class="clear"></span>
  </main>
  <footer>
    <input id="recompress" type="hidden" value="继续压缩图像">
    <script src="p.js"></script>
  </footer>
</body>

</html>
